<%@page import="com.sun.star.util.URL"%>
<%@page import="java.awt.image.BufferedImage"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@page isELIgnored="false"%>
<!DOCTYPE html>
<html>
<head>
	<script src="/js/jquery-3.3.1.min.js"></script>
	<link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css" />
	<link rel="stylesheet" href="/js/bootstrap/css/bootstrap-theme.min.css" />
	<script src="/js/bootstrap/js/bootstrap.min.js"></script>
	<script src="/js/bootstrap/jquery.form.js"></script>
	<script src="/js/bootstrap/Sco.js"></script>
	<link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon" />
	<script type="text/javascript" src="/js/common.js"></script>
	<link rel="stylesheet" href="/css/common.css" />
	<style>
		html, body {
/* 			height: 100%;
			<c:forEach items="${positionListImg}" var="MeetingType">
 			<c:choose>
 		   <c:when test="${MeetingType.positionId == '1'}">  
 			background:url("/myvirtualdir/${MeetingType.chooseImg}") 0 0 no-repeat,</c:when> <c:when test="${MeetingType.positionId == '2'}">  url("/myvirtualdir/${MeetingType.chooseImg}") 0 0 no-repeat; 
</c:when> 
 	   </c:choose> 
 	   </c:forEach>
			background-size: 100%,100%;	 */	
			
			
 			 overflow: hidden;  
    height: 100%;  
    margin: 0;  
			
			
						height: 100%;
			background:/* url("/myvirtualdir/login_bg_head_环江202410091452019.png") 0 0 no-repeat, */url("/myvirtualdir/login_bg202409282140348.jpg") 0 0 no-repeat;
/* 			background-size: 100%,100%;	 */	
background-position: top,25% 38%; /* 居中显示 */  
  background-repeat: 100%,no-repeat; /* 不重复 */  
  background-size: 100%,cover;
  
    dialog {
    border: 1px solid #ccc;
    padding: 20px;
    border-radius: 10px;
margin-left: auto;
  margin-right: auto;
  width: 20%;
  top: 40%;
  }
  .close-button {
    float: right;
    cursor: pointer;
  }	
		}
		
		.text-box {
  border: 1px solid #000;
  padding: 10px;
  margin: 10px 0;
  width: auto;
}


.shallow-transparent-banner {  
            width: 100%;  
            height: 60px; /* 横幅高度，可根据需要调整 */  
            background-color: rgba(255, 255, 255, 0.5); /* 浅色透明背景，rgba的最后一个值是透明度，0.7表示70%的不透明度 */  
            position: fixed; /* 固定定位，使横幅始终位于页面顶部 */  
            top: 0; /* 距离页面顶部0px */  
            left: 0; /* 距离页面左侧0px */  
            z-index: 1000; /* 确保横幅在其他内容之上 */  
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 轻微的下阴影 */  
            display: flex; /* 使用flex布局来居中内容（可选） */  
            align-items: center; /* 垂直居中内容（可选） */  
            justify-content: center; /* 水平居中内容（可选） */  
            font-family: Arial, sans-serif; /* 设置字体（可选） */  
        }  
        
        .shallow-transparent-banner2 {  
            width: 100%;  
            height: 300px; /* 横幅高度，可根据需要调整 */  
            background-color: rgba(255, 255, 255, 0.3); /* 浅色透明背景，rgba的最后一个值是透明度，0.7表示70%的不透明度 */  
            position: fixed; /* 固定定位，使横幅始终位于页面顶部 */  
            bottom: 5px; /* 距离页面顶部0px */  
            left: 0; /* 距离页面左侧0px */  
            z-index: 1000; /* 确保横幅在其他内容之上 */  
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 轻微的下阴影 */  
            display: flex; /* 使用flex布局来居中内容（可选） */  
            align-items: center; /* 垂直居中内容（可选） */  
            justify-content: center; /* 水平居中内容（可选） */  
            font-family: Arial, sans-serif; /* 设置字体（可选） */  
        } 
  
        .banner-text {  
        white-space: nowrap; /* 禁止换行 */
            color: #333; /* 文本颜色，可根据背景图片调整 */  
            font-size: 25px; /* 字体大小（可选） */  
            font-weight: bold; /* 字体粗细（可选） */  
            font-family: 'Microsoft YaHei', '仿宋', serif; /* 设置字体为宋体 */
             -webkit-text-stroke: 0px black; /* 设置描边宽度和颜色 */  
            color: white; /* 文字本身也设置为白色，与描边颜色对比 */  
        }  
        
        .banner-text2 {  
        white-space: nowrap; /* 禁止换行 */  
            /*color: #333;  文本颜色，可根据背景图片调整 */  
            color: rgb(250, 244, 8);
            font-size: 40px; /* 字体大小（可选） */  
            font-weight: bold; /* 字体粗细（可选） */  
            font-family: 'Microsoft YaHei', '仿宋', serif; /* 设置字体为宋体 */
             -webkit-text-stroke: 0px black; /* 设置描边宽度和颜色 */  
            /*color: white;  文字本身也设置为白色，与描边颜色对比 */  
        } 
		
		
	</style> 
	
	<script type="text/javascript">
 	$(function() {
 			
 		/* 			<c:forEach items="${positionListImg}" var="MeetingType">
 	
 			<c:choose>
 			
 		   <c:when test="${MeetingType.positionId == '1'}">  
 		   var head = "url('/myvirtualdir/${MeetingType.chooseImg}') no-repeat 0 0, "
 	    </c:when> 
 		   
 	    <c:when test="${MeetingType.positionId == '2'}">  
 	   var bg="url('/myvirtualdir/${MeetingType.chooseImg}') no-repeat 0 0";
 	    </c:when> 
 	    
 	   </c:choose> 
 	    
 	   </c:forEach>
   		    "url('/img/login_bg_head.png') no-repeat 0 0, " +  
 		    "url('/img/login_bg.jpg') no-repeat 0 0";   
  		    
  		    
  		  document.body.style.background = head + bg;*/
 		/*	$.ajax({
		    type: 'POST',
		    url: '/sys/selectImgShow', // 修改为你的服务器端点
		    data: formData,
		    dataType: 'json',
		    success: function(response) {
		    	alert(response);
 	    	$.each(response, function(index, imgPosition) {
		    	 alert(imgPosition.positionId);
		    	 alert(imgPosition.chooseImg);
		    	
		    	
		    	}); 
		    }
		  });*/
	}); 
	
	</script>
	
</head>
<body >
<dialog id="my-dialog">
  <p>系统关闭中，可在厂家协助下解锁重启</p>
  &nbsp;&nbsp;&nbsp;
  <button id="close-dialog">关闭弹窗</button>
  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <button id="open-dialog">解锁</button>
</dialog>
<dialog id="myDialog">
  <form id="myForm" method="dialog">
    <label for="textinput">请输入解锁码:</label>
    <textarea id="textinput" cols="40" rows="10" spellcheck="false"></textarea>
    <menu>
      <input type="submit" value="提交">
      <button id="close-reset" type="reset">重置</button>
      <button id="close-text" type="reset">取消</button>
      <span id="error" style="color: red; font-weight: bold;"> 解锁码不正确请自行确认是否正确输入或联系厂家 </span>
    </menu>
  </form>
</dialog>
<div id="myAnchorPoint2">
		&nbsp;
		</div>
    <div id="myDiv" class="shallow-transparent-banner" style="height: 80px;"> 
     <div class="image-container">  
        <!-- <img src="/img/zhujianhui.png" alt="描述图像的文字" style="margin-right: -14px;height: 70px;margin-right: 30px;"> -->  
    </div>   
        <input type="text" class="form-control"
			style="width: 200px; display: none" id="imgName3" name="imgDescribe"
			 placeholder="片名" />
        <div class="banner-text" style="width: 1000px; margin-right: 350px;margin-left: 240px;color: rgb(250, 244, 8);/* padding-bottom: 30px; */">中国共产党南宁市住房保障发展中心总支部委员会</div>  
         <div id="myDivClass" class="banner-text" style="padding-right: 300px;" ><a class="banner-text2" href="javascript:scrollToAnchor('myAnchorPoint')">强首府 &nbsp;担使命&nbsp; 住房保障先锋行</a></div> 
         <div id="myDivClass2" class="banner-text" style="padding-right: 300px;block;/* padding-bottom: 30px; */  display: none "><a  class="banner-text2" style="font-size:30px" href="javascript:scrollToAnchor('myAnchorPoint2')">返回登录</a></div>
    </div>  
	<div id="shouquantishi">
		<c:choose>
			<c:when test="${longValue < 10 && longValue >-1}">
				<div id="scrollText" class="text-box" style="width: 380px;">
					<div style="width: 353px;text-align: center;">
						<span style="color: white;">距离系统关闭还剩${longValue}天 <button id="delete-button" onclick="deleteText()">关闭</button></span>
					</div>
				</div>
			</c:when>
								  
			<c:when test="${longValue <= -1}">
				<div id="scrollText" class="text-box" style="width: 380px;">
					<div style=" width: 353px;text-align: center;">
				  		<p>系统关闭中 <button id="delete-button" onclick="deleteText()">x</button></p>
				    </div>
				</div>
			</c:when>
		</c:choose>
	</div>
	<div style="height:100%;" align="center">
		<div style="margin-top: 100px;">
			<table style="height:100%;background: #ffffff00;">
				<tr>
					<td align="right" valign="middle" width="50%">
						<img style="width:600px;padding-top: 75px;padding-bottom: 120px;" src="/myvirtualdir/41022154136.png">
					</td>
				
					<td width="10%"> </td>
					<td align="left" valign="middle">
						<form id="form_login" method="post" class="form-inline" style="height:353px;width:400px;background: white;padding: 30px 0 0 40px;line-height: 50px;border-radius: 8px;margin-top:20px;margin-bottom: 120px;">
						  <div><img src="/img/favicon.ico"  style="position:relative;bottom: 5px;"><h2  style="display:inline;font-family: 华文行楷;">&nbsp;&nbsp;党建管理平台</h2></div>
						  <div class="form-group">
						    <label class="control-label" for="username">账&nbsp;&nbsp;&nbsp;&nbsp;号</label>
						    <div class="input-group">
						      <span id="mySpan" 
						      class="input-group-addon glyphicon glyphicon-user myglyicon" style="color:#b13939;top: 0px;"></span>
						      <input type="text" class="form-control" id="username" name="username"  placeholder="姓名/手机号码">
						    </div>
						  </div>
						  <div class="form-group">
						    <label class="control-label" for="password">密&nbsp;&nbsp;&nbsp;&nbsp;码</label>
						    <div class="input-group">
						      <span class="input-group-addon glyphicon glyphicon-lock" style="color:#b13939;top: 0px;"></span>
						      <input type="password" class="form-control" id="password" name=password placeholder="密码">
						    </div>
						  </div>
						   <c:if test="${isCheck > 1 }">
							  <div class="form-group">
							    <label class="control-label" for="password">验证码</label>
							    <div class="input-group">
							      <input type="text" class="form-control" id="vc" name="check_text" style="width: 56%; border-radius:5px;" placeholder="不分大小写">
							      <img id="vc_img" alt="" src="/login/VC" style="position: absolute; left: 109px; top: -2px" onclick="on_img()">
							    </div>
							  </div>
						   </c:if>
						  <c:if test="${not empty loginInfo }">
							  <div class="form-group">
							   	 <label class="control-label" style="color:red;padding-left:32px">${loginInfo }</label>
							  </div>
						  </c:if>
						  <div style="padding:20px 0 0 65px">
						  		<button type="reset" class="btn btn-danger btn-sm" style="width:80px;ountline:none">&nbsp;重  置 &nbsp;</button>
						  		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						  		<button id="ajaxButton" type="submit" 
						  		class="btn btn-danger btn-sm" style="width:80px;ountline:none">&nbsp;登   录 &nbsp;</button>
						  </div>
						  <div  style="padding-left:30px;color:rgba(246, 224, 220, 1);padding-top:40px;font-size: 12px;"> 
						  <BR/> 推荐分辨率：1920*1080 | ©2016 桂科院纬福信息</div>
						</form>
					</td>
					<td width="1%"> </td>
					
					<!-- <td>
						<form style="height:300px;width:230px;background: white;padding: 30px 0 0 40px;line-height: 50px;border-radius: 8px;margin-top:20px;">
						<div><span style="display:inline;font-family: 华文细黑;">扫一扫下载红星智信</span></div>
						<img alt="" src="/img/redLetter.png" width="150px" height="150px">
						</form>
					</td> -->
				</tr>
			</table>
		</div>
		
		
		<div id="myDiv2">
<!-- 				<img style="position: absolute; top: 75%; right: 26%; width: 267px; height: 150px;" src="/myvirtualdir/20241021152632.png">
				<img style="position: absolute; top: 75%; left: 30%; width: 267px; height: 150px;" src="/myvirtualdir/20241021152638.png"> -->
<!-- 				<div  class="shallow-transparent-banner2" style="margin-top: 25px; height: 300px;">
					<h3>荣誉资质</h3>
				<img style="position: absolute; top: 10%; right: 20%; width: 444px; height: 250px;" src="/myvirtualdir/20241021152632.png">
				<img style="position: absolute; top: 10%; left: 20%; width: 444px; height: 250px;" src="/myvirtualdir/20241021152638.png">
				<img  src="/myvirtualdir/20241021185214.png">
				</div>
		</div> -->
	</div>
	<!-- <div style="height: 60px; position:absolute; top:12px; left:160px; font-family: 黑体; font-size: 32pt; color: white;">人民法院</div> -->

		<div>
		&nbsp;
		&nbsp;
		&nbsp;
		&nbsp;
		&nbsp;
		&nbsp;
		</div>
<div  style="align: center;">
		<img alt="" src="/myvirtualdir/zhubao8.png" width="1800px" height="1000px" style="padding-top: 165px;">
<!-- 		<img alt="" src="/myvirtualdir/8241022160339.png" width="800px" height="450px" style="padding-top: 150px;padding-top: 150px;padding-left: 300px;"> -->
		</div >
		<div id="myAnchorPoint">
		&nbsp;
		</div>

</body>
</html>
<script type="text/javascript">


function scrollToAnchor(id) { 
	
	var inputElement = document.getElementById('imgName3');
	 var myAnchorPoint = document.getElementById('myDivClass');
	 var myAnchorPoint2 = document.getElementById('myDivClass2');
	 var myAnchorPoint3 = document.getElementById('myDiv2');
/* 	 var myDiv = document.getElementById('myDiv'); */
    // 设置input元素的值  
	   if (inputElement.value === "") {  
	        // 输入框的值是空的，可以视为“未设置”  
		   inputElement.value = inputElement.value+"a"; 
		   myAnchorPoint.classList.add("hidden");
		   myAnchorPoint2.style.display = "block";
		   myAnchorPoint2.classList.remove("hidden");
		   myAnchorPoint3.classList.add("hidden");
 		   myDiv.style.height = '48px'; 
	    }else{
	    	
	    	 inputElement.value = "";
	    	 myAnchorPoint.classList.remove("hidden");
			   myAnchorPoint2.classList.add("hidden");
			   myAnchorPoint3.classList.remove("hidden");
			   myDiv.style.height = '80px'; 
	    } 
    
    var element = document.getElementById(id);  
    if (element) {  
        element.scrollIntoView({ behavior: 'smooth' });
    }  
    
} 

function startScrolling() {
	  const scrollText = document.getElementById('scrollText');
	  setInterval(() => {
	    scrollText.scrollBy(0, 1);
	  }, 100); // 每0.1秒滚动1像素
	 
	  setTimeout(() => {
/* 		    clearInterval(scrollText.interval);
	    scrollText.innerHTML = ''; */
		  var container = document.getElementById('scrollText');
		  container.parentNode.removeChild(container);
	  }, 6000); // 5秒后停止滚动并清空内容
	}

	function deleteText() {
	  var container = document.getElementById('scrollText');
	  container.parentNode.removeChild(container);
	}
	// 页面加载完成后开始滚动
	window.onload = startScrolling;



document.getElementById('close-reset').onclick = function() {
	document.getElementById('error').style.display='none';
  };

  document.getElementById('close-dialog').onclick = function() {
    document.getElementById('my-dialog').close();
  };
  
  document.getElementById('open-dialog').addEventListener('click', function() {
	    document.getElementById('myDialog').showModal();
	    document.getElementById('error').style.display='none';
	  });
  document.getElementById('close-text').addEventListener('click', function() {
	    document.getElementById('myDialog').close();
	    document.getElementById('my-dialog').close();
	  });

$(document).ready(function(){
	
	var main = document.getElementById('form_login');
	if("${not empty loginInfo }" == "true" || "${isCheck}" > 3){
		main.style.height = "353px";
	}else{
		main.style.height = "300px";
	}
	
});

	$('#form_login').submit(function(event) {
		  event.preventDefault(); // 阻止表单默认提交行为
		 
		  var formData = $(this).serialize(); // 序列化表单数据
		 
		  $.ajax({
		    type: 'POST',
		    url: '/login/login', // 修改为你的服务器端点
		    data: formData,
		    success: function(response) {
		    	if(response == 'hello'){
		    		
		    		document.getElementById('my-dialog').show();
		    		
		  	    }else{
		    	
		  	    	location.reload();
		    	
		    	}
		    }
		  });
		});
	
	  $(document).ready(function() {
		    $('#myDialog form').on('submit', function(e) {
		      e.preventDefault(); // 阻止表单默认提交行为
		      /* var formData = $(this).serialize(); // 序列化表单数据 */
		 var textareaValue = $('#textinput').val();
		      $.ajax({
		        type: 'POST',
		        url: '/login/check', // 替换为你的服务器端处理URL
		        data:{ text: textareaValue },
		        success: function(response) {
			    	if(response == 'erro'){
			    		
			    		document.getElementById('error').style.display='block';
			    		
			  	    }else{
			    	
			  		    document.getElementById('myDialog').close();
			  		    document.getElementById('my-dialog').close();
			    	
			    	}
			    }
		      });
		    });
		  });
	  

	  
	

//改变验证码
function on_img() {
	document.getElementById('vc_img').src='/login/VC?'+Math.random();
}

</script>
